<%@page import="com.entity.UserInfo"%>
<%@page import="com.biz.ProductBizImpl"%>
<%@page import="com.entity.Product"%>
<%@page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML>
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>我的订单</title>
    
	<meta charset="UTF-8">
    <meta name="keywords" content="keyword1,keyword2,keyword3">
    <meta name="description" content="this is my page">
    <meta name="content-type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" type="text/css" href="css/showtable.css">
    <link rel="stylesheet" type="text/css" href="css/modle.css">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<style type="text/css">
		
		.title-table{
			background-image: linear-gradient(225deg, #D4FFEC 0%, #57F2CC 48%, #4596FB 100%);
			padding: 10px;
			margin-left: 2%;
			margin-right: 2%;
			margin-bottom: 0px;
			width: 500px;
			padding-left: 20px;
			border-radius: 25px;
			color: white;
			text-align: left;
		}
		#main-table {
			width: 96%;
			margin: 10px auto;
		}
		#main-table tr{
			background: none;
		}
		#main-table tr:hover{
			background: #87CEFA;
		}
		#main-table table tr{
			background: #fcfcfc;
			color: black;
		}
		
		#main-table tr:FIRST-CHILD{
			background: #87CEFA;
		}
		#main-table tr:FIRST-CHILD:hover{
			background: #87CEFA;
		}
		
		#main-table table tr:FIRST-CHILD{
			background: #f1f1f1;
			color: black;
		}
		.orders td{
			background: #d5d5d5;
		}
	</style>
	<script src="js/jquery-1.12.4.js"></script>
	<script type="text/javascript">
		function delorder( delid ){
			if(confirm("确定要取消该订单吗")){
				location="user/orders?act=del&id="+delid;
			}
		}
		function modorder( id ){
			if(confirm("确定要收货吗")){
				location="user/orders?act=mod2&id="+id;
			}
		}
		$(function(){
			$(".orders").dblclick(function(){
				$(this).next().find("table").toggle();
			});
		});
	</script>
  </head>
  
  <body class="mybody">
  	<div class="main">
  		<div class="index-title">
  			<iframe src="index-b-elem/header.jsp" frameborder="0" id="title-if"></iframe>
  		</div>
	    <div class="main-body-div">
	    	<h2 class="title-table">我的订单</h2>
	    	<table id="main-table">
	    		<tr>
	    			<td>订单编号</td>
	    			<td>下单时间</td>
	    			<td>收货人</td>
	    			<td>联系电话</td>
	    			<td>收货地址</td>
	    			<td>订单状态</td>
	    			<td>操作</td>
	    		</tr>
	    	<c:forEach items="${ospb.list }" var="os">
	    		<tr class="orders">
	    			<td>${os.id }</td>
	    			<td>${os.orderDate}</td>
	    			<td>${os.contacts }</td>
	    			<td>${os.phone }</td>
	    			<td>${os.country }${os.province }${os.city }${os.area }${os.address }</td>
	    			<td>${os.state==0?"未发货":os.state==1?"已发货":"已完成" }</td>
	    			<td>
	    				<a href="javascript:delorder(${os.id })" style="display: ${os.state==2?'none':''}">取消订单</a>
	    				<a href="#" style="display: ${os.state!=2?'none':''}">再次购买</a>
	    				<span style="display: ${os.state==1?'':'none'}">&nbsp;|&nbsp;</span>
	    				<a href="javascript:modorder(${os.id })" style="display: ${os.state==1?'':'none'}">确认收货</a>
	    			</td>
	    		</tr>
	    		<tr class="ordersdetails">
	    			<td colspan="7">
		    		<table>
		    			<tr>
			    			<td style="width: 25%;">商品名</td>
			    			<td style="width: 10%;">数量</td>
			    			<td style="width: 10%;">价格</td>
			    			<td style="width: 55%;">留言</td>
		    			</tr>
		    		<c:forEach items="${os.odlist }" var="ods">
		    			<tr>
			    			<td>${ods.pname }</td>
			    			<td>${ods.num }</td>
			    			<td>${ods.price }</td>
			    			<td>${ods.comments }</td>
		    			</tr>
		    		</c:forEach>
		    		</table>
		    		</td>
	    		</tr>
	    	</c:forEach>
	    	</table>
	    	<p style="text-align:center"> 当前页数:[${ospb.currPage}/${ospb.totalPage}]&nbsp; 
		        <a href="user/orders?page=1">首页</a>
		        <a href="user/orders?page=${ospb.currPage > 1 ? ospb.currPage-1 : 1}">上一页</a>
		        <a href="user/orders?page=${ospb.currPage < ospb.totalPage ? ospb.currPage+1 : ospb.totalPage}">下一页</a> 
		        <a href="user/orders?page=${ospb.totalPage}">末页</a>
       		</p>
		</div>
		<div class="index-footer">
  			<iframe src="index-b-elem/footer.jsp" frameborder="0" id="title-if"></iframe>
  		</div>
   	</div>
  </body>
</html>
<jsp:include page="../mybrowse.jsp"></jsp:include>